<template>
  <view class="viewport">
    <scroll-view enable-back-to-top scroll-y class="scroll">
      <uni-section title="配置计划" type="line">
        <view class="example">
          <uni-forms ref="baseForm" :modelValue="form">
            <uni-forms-item label="年份" label-width="170rpx">
              <uni-data-select
                v-model="form.SaveYear"
                :localdata="yeardata"
                @change="changeYear"
              ></uni-data-select>
            </uni-forms-item>
            <uni-forms-item label="目标" label-width="170rpx">
              <uni-easyinput disabled type="number" v-model="calPlanTotalAmount" />
            </uni-forms-item>
            <!-- 1月 -->
            <uni-forms-item label="1月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount1" />
            </uni-forms-item>
            <!-- <uni-forms-item label="1月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount1" />
            </uni-forms-item>
            <uni-forms-item label="1月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status1" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 2月 -->
            <uni-forms-item label="2月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount2" />
            </uni-forms-item>
            <!-- <uni-forms-item label="2月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount2" />
            </uni-forms-item>
            <uni-forms-item label="2月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status2" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 3月 -->
            <uni-forms-item label="3月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount3" />
            </uni-forms-item>
            <!-- <uni-forms-item label="3月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount3" />
            </uni-forms-item>
            <uni-forms-item label="3月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status3" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 4月 -->
            <uni-forms-item label="4月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount4" />
            </uni-forms-item>
            <!-- <uni-forms-item label="4月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount4" />
            </uni-forms-item>
            <uni-forms-item label="4月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status4" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 5月 -->
            <uni-forms-item label="5月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount5" />
            </uni-forms-item>
            <!-- <uni-forms-item label="5月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount5" />
            </uni-forms-item>
            <uni-forms-item label="5月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status5" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 6月 -->
            <uni-forms-item label="6月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount6" />
            </uni-forms-item>
            <!-- <uni-forms-item label="6月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount6" />
            </uni-forms-item>
            <uni-forms-item label="6月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status6" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 7月 -->
            <uni-forms-item label="7月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount7" />
            </uni-forms-item>
            <!-- <uni-forms-item label="7月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount7" />
            </uni-forms-item>
            <uni-forms-item label="7月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status7" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 8月 -->
            <uni-forms-item label="8月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount8" />
            </uni-forms-item>
            <!-- <uni-forms-item label="8月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount8" />
            </uni-forms-item>
            <uni-forms-item label="8月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status8" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 9月 -->
            <uni-forms-item label="9月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount9" />
            </uni-forms-item>
            <!-- <uni-forms-item label="9月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount9" />
            </uni-forms-item>
            <uni-forms-item label="9月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status9" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 10月 -->
            <uni-forms-item label="10月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount10" />
            </uni-forms-item>
            <!-- <uni-forms-item label="10月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount10" />
            </uni-forms-item>
            <uni-forms-item label="10月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status10" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 11月 -->
            <uni-forms-item label="11月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount11" />
            </uni-forms-item>
            <!-- <uni-forms-item label="11月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount11" />
            </uni-forms-item>
            <uni-forms-item label="11月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status11" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
            <!-- 12月 -->
            <uni-forms-item label="12月计划存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.PlanAmount12" />
            </uni-forms-item>
            <!-- <uni-forms-item label="12月实际存" label-width="170rpx">
              <uni-easyinput type="number" v-model="form.RealAmount12" />
            </uni-forms-item>
            <uni-forms-item label="12月已存" label-width="170rpx">
              <uni-data-checkbox v-model="form.Status12" :localdata="statusdata" mode="default" />
            </uni-forms-item> -->
          </uni-forms>
        </view>
      </uni-section>
      <button class="button btn" @click="ok">确认</button>
      <button class="button btn" @click="back">取消</button>
    </scroll-view>
  </view>
  <!-- 提示确认是否删除 弹窗 -->
  <uni-popup ref="alertDialog" type="dialog">
    <uni-popup-dialog
      type="warn"
      cancelText="取消"
      confirmText="确定"
      title="通知"
      content="确定要删除么？"
      @confirm="del"
      @close="cancel"
    ></uni-popup-dialog>
  </uni-popup>
</template>
<script setup lang="ts">
import { GetUserAccountAPI } from '@/services/detail'
import {
  AddNoteAccountJobAPI,
  AddNoticeAPI,
  DelNoteAccountJobAPI,
  DelNoticeAPI,
  GetGoodTypesAPI,
  GetOneNoteAccountJobAPI,
  GetOneNoticeAPI,
  GetSaveMoneyAPI,
  GetSaveMoneyAddAPI,
  NoteAccountJobAPI,
  UpdateNoteAccountJobAPI,
  UpdateNoticeAPI,
  UpdateSaveMoneyAPI,
} from '@/services/job'
import { useMemberStore } from '@/stores'
import type { GoodType } from '@/types/detail'
import type { GetNoteAccountJobResponse, GetSaveMoneyAddResponse, selectdata } from '@/types/job'
import type { Notice } from '@/types/notelog'
import { onLoad, onShow } from '@dcloudio/uni-app'
import { computed, ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
// 获取屏幕边界到安全区域距离
const { safeAreaInsets } = uni.getSystemInfoSync()
// 获取会员信息
const memberStore = useMemberStore()
const form = ref<GetSaveMoneyAddResponse>({
  Auth: '',
  SaveYear: 0,
  PlanTotalAmount: 0,
  ID1: 0,
  PlanAmount1: '0',
  RealAmount1: 0,
  Status1: 0,
  SaveMonth1: 0,
  ID2: 0,
  PlanAmount2: '0',
  RealAmount2: 0,
  Status2: 0,
  SaveMonth2: 0,
  ID3: 0,
  PlanAmount3: '0',
  RealAmount3: 0,
  Status3: 0,
  SaveMonth3: 0,
  ID4: 0,
  PlanAmount4: '0',
  RealAmount4: 0,
  Status4: 0,
  SaveMonth4: 0,
  ID5: 0,
  PlanAmount5: '0',
  RealAmount5: 0,
  Status5: 0,
  SaveMonth5: 0,
  ID6: 0,
  PlanAmount6: '0',
  RealAmount6: 0,
  Status6: 0,
  SaveMonth6: 0,
  ID7: 0,
  PlanAmount7: '0',
  RealAmount7: 0,
  Status7: 0,
  SaveMonth7: 0,
  ID8: 0,
  PlanAmount8: '0',
  RealAmount8: 0,
  Status8: 0,
  SaveMonth8: 0,
  ID9: 0,
  PlanAmount9: '0',
  RealAmount9: 0,
  Status9: 0,
  SaveMonth9: 0,
  ID10: 0,
  PlanAmount10: '0',
  RealAmount10: 0,
  Status10: 0,
  SaveMonth10: 0,
  ID11: 0,
  PlanAmount11: '0',
  RealAmount11: 0,
  Status11: 0,
  SaveMonth11: 0,
  ID12: 0,
  PlanAmount12: '0',
  RealAmount12: 0,
  Status12: 0,
  SaveMonth12: 0,
  UserGroup: memberStore.profile!.UserGroup,
})
const yeardata = ref([
  { value: 2024, text: '2024' },
  { value: 2025, text: '2025' },
  { value: 2026, text: '2026' },
  { value: 2027, text: '2027' },
  { value: 2028, text: '2028' },
  { value: 2029, text: '2029' },
  { value: 2030, text: '2030' },
  { value: 2031, text: '2031' },
  { value: 2032, text: '2032' },
  { value: 2033, text: '2033' },
  { value: 2034, text: '2034' },
  { value: 2035, text: '2035' },
])
const statusdata = ref([
  { value: 0, text: '未存' },
  { value: 1, text: '已存' },
])
const monthdata = ref([
  { value: 1, text: '1' },
  { value: 2, text: '2' },
  { value: 3, text: '3' },
  { value: 4, text: '4' },
  { value: 5, text: '5' },
  { value: 6, text: '6' },
  { value: 7, text: '7' },
  { value: 8, text: '8' },
  { value: 9, text: '9' },
  { value: 10, text: '10' },
  { value: 11, text: '11' },
  { value: 12, text: '12' },
])

const accountTypedata = ref([
  { value: '收入', text: '收入' },
  { value: '支出', text: '支出' },
  { value: '转账', text: '转账' },
])
const checkdata = [
  { value: true, text: '是' },
  { value: false, text: '否' },
]
const repeateTypedata = ref([
  { value: '日', text: '日' },
  { value: '周', text: '周' },
  { value: '月', text: '月' },
  { value: '年', text: '年' },
])
//提示框
const alertDialog = ref<{
  open: (type?: UniHelper.UniPopupType) => void
  close: () => void
}>()
const ID = ref<number>()
const goodTypedata = ref<selectdata[]>()
const accountFromdata = ref<selectdata[]>()
const accountTodata = ref<selectdata[]>()
const calPlanTotalAmount = computed(() => {
  return (
    parseFloat(form.value.PlanAmount1) +
    parseFloat(form.value.PlanAmount2) +
    parseFloat(form.value.PlanAmount3) +
    parseFloat(form.value.PlanAmount4) +
    parseFloat(form.value.PlanAmount5) +
    parseFloat(form.value.PlanAmount6) +
    parseFloat(form.value.PlanAmount7) +
    parseFloat(form.value.PlanAmount8) +
    parseFloat(form.value.PlanAmount9) +
    parseFloat(form.value.PlanAmount10) +
    parseFloat(form.value.PlanAmount11) +
    parseFloat(form.value.PlanAmount12)
  )
})
//============================以下函数========================
//加载初始化
onLoad(async (option) => {
  console.log('Year' + option?.SaveYear)
  form.value.SaveYear = option?.SaveYear
  form.value.Auth = memberStore!.profile!.Token
  form.value.UserGroup = memberStore!.profile!.UserGroup
  await reFresh()
})
/**
 * 获取任意时间
 */
const getDate = (date: Date, AddDayCount: number) => {
  if (!date) {
    date = new Date()
  }
  const dd = new Date(date)

  dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
  const y = dd.getFullYear()
  const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期，不足10补0
  const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号，不足10补0
  return {
    fullDate: y + '-' + m + '-' + d,
    year: y,
    month: m,
    date: d,
    day: dd.getDay(),
  }
}
//刷新事件
const reFresh = async () => {
  if (form.value.SaveYear) {
    if (memberStore.profile) {
      const res = await GetSaveMoneyAddAPI({
        Auth: memberStore.profile.Token,
        Year: form.value.SaveYear,
        UserGroup: memberStore.profile.UserGroup,
      })
      form.value = res.result
    } else {
      uni.showToast({ icon: 'none', title: '请先登录' })
      setTimeout(() => {
        // 页面跳转
        uni.switchTab({ url: '/pages/my/my' })
      }, 500)
    }
  }
}
//初始化账户列表
const InitUserAccount = async () => {
  if (memberStore.profile) {
    const res = await GetUserAccountAPI({
      UserName: memberStore.profile.UserName,
      Auth: memberStore.profile.Token,
      UserGroup: memberStore.profile.UserGroup,
    })
    let data = res.result.map((item) => ({ value: item.AccountNo, text: item.Display }))
    accountFromdata.value = data
    accountTodata.value = data
  }
}
//初始化商品类别
const InitGoodTypes = async (e: string) => {
  const res = await GetGoodTypesAPI({
    inout: e,
    UserGroup: memberStore.profile!.UserGroup,
  })
  goodTypedata.value = res.result
}

//返回
const back = () => {
  uni.navigateTo({ url: '/pages/plan/savemoney' })
}
//确认
const ok = async () => {
  form.value.PlanTotalAmount = calPlanTotalAmount.value
  const res = await UpdateSaveMoneyAPI(form.value)

  // 成功提示
  uni.showToast({ icon: 'success', title: '保存成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/plan/savemoney' })
  }, 500)
}
//删除时，打开确认框
const OnAlertDialog = async () => {
  alertDialog.value?.open()
}
//取消
const cancel = async () => {
  alertDialog.value?.close()
}
//确认删除
const del = async () => {
  const res = await DelNoticeAPI({
    Auth: memberStore!.profile!.Token,
    ID: ID.value!,
  })
  // 成功提示
  uni.showToast({ icon: 'success', title: '保存成功' })
  setTimeout(() => {
    // 页面跳转
    uni.navigateTo({ url: '/pages/NoteAcount/Notice' })
  }, 500)
}

//下拉选择年事件
const changeYear = async (e: any) => {
  await reFresh()
}
</script>
<style lang="scss">
@import './styles/savemoneyAdd.scss';
</style>
